Technical Blog
JS Fundamentals
Learning Competencies


What is DOM?

The DOM stands for Document Object Model, it is an interface that allows developers to interact and control the Elements of the web.


The Document Object Model is a model that defines HTML and XML documents as a tree structure, where each node of the tree is an object which represents a part of the document.

The DOM acts as an interface between document and Javascript. Using DOM + Javascript developers can access and modify each and every element of the document using DOM.

See in the picture below, the document has represented a tree where 'html', 'body' etc are the branch that ends with a node like 'p', 'li', 'td', etc.

DOM

The DOM has a hierarchical structure. The lower elements are children of upper connected elements and side elements having the same parents are called siblings.

There are 3 parts of W3C DOM standard:

  • Core DOM: Standard model for all document types
  • XML DOM: Document Object Model for XML document
  • HTML DOM: Document Object Model for HTML document

What is DOM Manipulation in javascript?

DOM Manipulation is the process of changing the content and structure of the DOM (document object model). The DOM can be modified by adding, removing, or modifying elements and their attributes.

DOM-manipulation
>